<template>

  <div class="common-layout">

    <el-header class="header">
      <h1>内部监控</h1>
  
    </el-header>
    <el-container>
      <el-aside width="200px" style="height:100vh">
        <el-row class="tac">
          <el-col :span="24">
            <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo"
              default-active="/nacos" text-color="#fff" style="height:100vh" @open="handleOpen" @close="handleClose"
              router>
              <el-menu-item-group title="服务监控">
                <el-menu-item index="/nacos">nacos</el-menu-item>
              </el-menu-item-group>
              <el-menu-item-group title="流量监控">
                <a href="http://106.12.147.168:8858/#/dashboard/home" target="_blank">
                  <el-menu-item index="/nacos">sentinel</el-menu-item>
                </a>
              </el-menu-item-group>
            </el-menu>
          </el-col>
        </el-row>
      </el-aside>
      <el-main>
        <router-view></router-view>
      </el-main>

    </el-container>
  </div>

</template>
<script>
import { ref } from 'vue'
const activeName = ref('first')
</script>
<style scoped>
.common-layout {
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.demo-tabs {
  width: 100vw;
  height: 100vh;
}

.header {
  background-color: #545c64;
  text-align: center;
}
</style>